import React from 'react'
import { Divider } from 'antd'
import { LwjButton } from "components";
import  LwjTable  from "components/LwjTable/LwjTable";

import moment from 'moment';
import { financialPaymentBillAuditStatus, financialPaymentBillPaymentStatus } from "utils/enumConfig"

const List = ({
  onShowDetail,
  onAudit,
  onSelectRows,
  onPay,
  onReceipt,
  ...tableProps
}) => {

  console.info(List)
  const columns = [
    {
      title: '付款单号',
      dataIndex: 'num',
      key: 'num',
      width: "15%"
    }, {
      title: '付款金额',
      dataIndex: 'payable',
      key: 'payable',
      width: "14%",
      align: "right",
      render: (text, record, index) => (record.payable.toFixed(2))
    }, {
      title: '收款方',
      dataIndex: 'payeeName',
      key: 'payeeName',
      width: "14%"
    }, {
      title: '审核状态',
      dataIndex: 'auditStatus',
      key: 'auditStatus',
      width: "14%",
      render: (text, record, index) => (financialPaymentBillAuditStatus[record.auditStatus])
    }, {
      title: '支付状态',
      dataIndex: 'paymentStatus',
      key: 'paymentStatus',
      width: "14%",
      render: (text, record, index) => (financialPaymentBillPaymentStatus[record.paymentStatus])
    }, {
      title: '付款时间',
      dataIndex: 'cashTime',
      key: 'cashTime',
      width: "15%",
      render: (text, record, index) => (
        record.cashTime > 0 ? moment(record.cashTime).format("YYYY-MM-DD HH:mm:ss") : ''
      )
    }, {
      title: '操作',
      key: 'handle',
      width: "15%",
      render: (text, record) => (
        <span>
          <LwjButton
            tooltip="查看"
            type="primary"
            shape="circle"
            size="small"
            icon="eye"
            onClick={() => onShowDetail(record)} />
          {record.auditStatus === "NULL" && (<Divider type="vertical" />)}
          {record.auditStatus === "NULL" && (<LwjButton
            tooltip="审核"
            type="primary"
            shape="circle"
            size="small"
            icon="check"
            onClick={() => onAudit(record)} />)}
          {record.paymentStatus === "PAYMENT_STAY" && (<Divider type="vertical" />)}
          {record.paymentStatus === "PAYMENT_STAY" && (<LwjButton
            tooltip="返充"
            type="primary"
            shape="circle"
            size="small"
            icon="rollback"
            onClick={() => onReceipt(record)} />)}
          {record.paymentStatus === "PAYMENT_STAY" && (<Divider type="vertical" />)}
          {record.paymentStatus === "PAYMENT_STAY" && (<LwjButton
            tooltip="支付"
            type="primary"
            shape="circle"
            size="small"
            icon="pay-circle"
            onClick={() => onPay(record)} />)}
        </span>
      )
    }
  ];
  console.info(tableProps)
  return (
    <LwjTable
      {...tableProps}
      columns={columns}
      selectType="multiple"
      onSelectRows={onSelectRows} />
  )
};

export default List
